//常量const 命名：全大写  如果有两个单词以上  用下划线  COMPANY_DATA

// 页面加载完成执行里面的代码
$(function () {
    // setCompanyTopData();//调用方法
    // setNavData();
    $.getJSON("../json/companyAndNav.json", function (data) {
        setCompanyTopData(data.company);//调用方法
        console.log(data.company)
        setNavData(data.nav);
        setCompanyFootData(data.company);
    })
});
//要对div赋值,赋值 动态
// 需要写一个方法
// 定义一个方法 命名规则：setCompanyData 小驼峰
function setCompanyTopData(data) {
// 检测有没有执行里面的代码
//    1.alert() //弹出框  js
//     alert("aaa");
//     prompt("aaa");
//     confirm("是否要删除？",function () {
//
//     })
//     2.console.log(111);
//     console.log("aaaa");
//    值 数据类型？JavaScript的数据类型？定义？
//     字符串值，数值，布尔值，数组，对象。
//     var aaaa = 7;  // 数字，包括整数和小数
//     var lastName = "Gates";  // 字符串,只要用引号括起来就是字符串,js不区分单双引号
//     var cars = ["Porsche", "Volvo", "BMW"];  // 数组,只要以中括号括起来就是数组
//     var x = {firstName: "Bill", lastName: "Gates"}; // 对象 ，只要以大括号括起来就是对象
//    var y=true;
// var 声明： length 变量名   =  赋值运算符   7   值
//    什么变量的方式有哪些？
//    var let const 三个的区别？
//     let bbbb = 77;
//     const cccc = 8888;
//     if (true) {
//         var aa = 8;
//         let bb = 88;
//         const cc = 999;
//     }
    //不能跨级别， 作用域的区别？var  全局变量  let  const 局部变量
    // console.log(cc)
//    var  全局变量  let  局部变量  const  常量 固定不变的变量
//    变量的命名规则？ 小驼峰式命名  见名知意 不要写缩写  yongYuanDeShen
//    运算符:
//     let a = '7a';
//     let b = "8b";
//     console.log(a + b);
//     双斜杠  单行注释：
//    js 注释 有几种？
    /**js
     注释*/
    /**/
    <!--注释-->
    // let phone = "028-99999000";
    // let logo = "../imgages/logo_g0yv.jpg";
    // let company = {phone: "028-99999000", logo: "../imgages/logo_g0yv.jpg"};//赋值
    // document.getElementsByName("")//拿到表单里面的对象
    // document.getElementById("")//通过id得到对象,唯一
    // document.getElementsByTagName("div");//拿到的是数组！
//    数组？ 多个元素放在一起 用一个变量标示 []
//    js是一个弱语言，
//     document.getElementById("phone").innerHTML = COMPANY.phone;

    // document.getElementById("logo").src = logo;
    //attr  给给定的属性赋值 是jQuery里面的知识点
    // document.getElementById("logo").attr("src", logo);
    // $("#logo").attr("src", COMPANY.logo);//jQuery的图片赋值
//    普遍变量的赋值和对象的取值赋值
// 对象{key:"value"}和json{"key":"value"}对象的区别？
//-----------------------------------------------------------------------
//     所有的数据应该从Java后台来，数据模拟来源于json文件
//     $.getJSON("../json/company.json", function (data) {
    document.getElementById("phone").innerHTML = data.phone;
    $("#logo").attr("src", data.logo);

    // })
}

//-----------------------------------------------------------------
// 导航信息,当元素一样的时候放在一个容器里面  拿这个容器就是数组
// const home = {title: "首页", href: "home.html"};
// const company = {title: "公司信息", href: "company.html"};
// const news = {title: "新闻信息", href: "news.html"};
// const product = {title: "产品信息", href: "product.html"};
// const online = {title: "在线留言", href: "online.html"};
// const callus = {title: "联系我们", href: "callus.html"};
// const nav = [home, company, news, product, online, callus];//
// 数组的索引或者编号从0开始nav[2]=news
// const navList = [
//     {
//         title: "首页", href: "home.html"
//     },
//     {
//         title: "公司信息", href: "company.html"
//     },
//     {
//         title: "新闻信息",
//         href: "news.html"
//     }];

function aa() {
    $.getJSON("json/userinfo.json", function (data) {
        // var $jsontip = $("#jsonTip");
        var strHtml = "123";
        //存储数据的变量
        $("#jsonTip").empty();
        //清空内容
        $.each(data, function (infoIndex, info) {
            strHtml += "姓名：" + info.name + "<br>";
            strHtml += "性别：" + info["sex"] + "<br>";
            strHtml += "邮箱：" + info["email"] + "<br>";
            strHtml += "<hr>"
        })
        $("#jsonTip").html(strHtml);
        //显示处理后的数据
    })
}

function setNavData(data) {
    // 这个斜杠的意思就是转义字符
    // let html="<div onclick=\"window.location.href='home.html'\">首页</div>";
    // let aa = "发的撒旦飞洒";
    // 只要是数组或者集合  首先想到的是遍历 循环
    // for   while
    // console.log(navList.length);
    // getJSON postJSON putJSON... get表示查询  put表示修改  post表示新增  delete表示删除
    // $.getJSON("../json/nav.json", {}, function (data) {
    let html = '';
    $.each(data, function (i, info) {
        html += '<div onclick="window.location.href=\'' + info.href + '\'">' + info.title + '</div>';
    });
    $("#nav").html(html);
    // });
    // let html = '';
    // for (let i = 0; i < nav.length; i++) {
    //     html += '<div onclick="window.location.href=\'' + nav[i].href + '\'">' + nav[i].title + '</div>';
    // }
    // // let html = '<div onclick="window.location.href=\'' + home.href + '\'">' + home.title + '</div>';
    // // html += '<div onclick="window.location.href=\'company.html\'">公司介绍</div>';
    // $("#nav").html(html);
}